<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>列表页</title>
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
    <link rel="stylesheet" href="./css/bese.css" />
    <link rel="stylesheet" href="./css/common.css" />
    <link rel="stylesheet" href="./font/iconfont.css" />
    <link rel="stylesheet" href="./css/list.css" />
  </head>
  <body>
    <!-- 快捷导航栏开始 -->
    <div class="shortcut">
      <div class="w">
        <div class="left"><span>品优购欢迎你！</span><a href="javascript:;">请登录</a><a href="javascript:;" class="style-red">立即注册</a></div>
        <div class="right">
          <ul>
            <li><a href="javascipt:;">我的订单</a></li>
            <li>
              <a href="javascipt:;"
                >我的品优购
                <span class="iconfont iconxiajiantou"></span>
              </a>
            </li>
            <li><a href="javascipt:;">品优购会员</a></li>
            <li><a href="javascipt:;">企业采购</a></li>
            <li>
              <a href="javascipt:;"
                >关注品优购
                <span class="iconfont iconxiajiantou"></span>
              </a>
            </li>
            <li>
              <a href="javascipt:;"
                >客户服务
                <span class="iconfont iconxiajiantou"></span>
              </a>
            </li>
            <li>
              <a href="javascipt:;"
                >网站导航
                <span class="iconfont iconxiajiantou"></span>
              </a>
            </li>
          </ul>
        </div>
      </div>
    </div>
    <!-- 快捷导航栏结束 -->
    <header class="header w">
      <!-- logo开始 -->
      <div class="logo">
        <h1>
          <a href="index.html" title="品优购">品优购商城</a>
        </h1>
      </div>
      <!-- logo结束 -->
      <!-- 列表页秒杀开始 -->
      <div class="sk">
        <img src="./images/secKill_03.png" alt="" />
      </div>
      <!-- 列表页秒杀结束 -->
      <!-- search开始 -->
      <div class="search">
        <input type="search" name="" id="" placeholder="语言开发" />
        <button>搜索</button>
      </div>
      <!-- search结束 -->
      <!-- 搜索热词开始 -->
      <div class="hotwrods">
        <a href="javascript:;" class="style-red">优惠购首发</a>
        <a href="javascript:;">亿元优惠 </a>
        <a href="javascript:;">9.9元团购 </a>
        <a href="javascript:;">美满99减30 </a>
        <a href="javascript:;">办公用品 </a>
        <a href="javascript:;">电脑 </a>
        <a href="javascript:;">通信</a>
      </div>
      <!-- 搜索热词结束 -->
      <!-- 我的购物车开始 -->
      <div class="myCar">
        <span class="iconfont iconqicheqianlian-"></span>
        <span>我的购物车</span>
        <span class="iconfont iconyoujiantou-01"></span>
        <span class="count"> 8 </span>
      </div>
      <!-- 我的购物车结束 -->
    </header>
    <!-- nav开始 -->
    <nav class="nav">
      <div class="w">
        <div class="sk_list">
          <ul>
            <li>
              <a href="javascript:;">品牌秒杀</a>
            </li>
            <li>
              <a href="javascript:;">品牌秒杀</a>
            </li>
            <li>
              <a href="javascript:;">品牌秒杀</a>
            </li>
          </ul>
        </div>
        <div class="navitems">
          <ul>
            <li><a href="javasrcipt:;">服装城</a></li>
            <li><a href="javasrcipt:;">美妆馆</a></li>
            <li><a href="javasrcipt:;">传智超市</a></li>
            <li><a href="javasrcipt:;">全球购</a></li>
            <li><a href="javasrcipt:;">闪购</a></li>
            <li><a href="javasrcipt:;">团购</a></li>
            <li><a href="javasrcipt:;">拍卖</a></li>
            <li><a href="javasrcipt:;">有趣</a></li>
          </ul>
        </div>
      </div>
    </nav>
    <!-- nav开始 -->
    <!-- list开始 -->
    <div class="list w">
      <div class="list_hd">
        <img src="./uploads/bg_03.png" alt="" />
      </div>
      <div class="list_bd">
        <ul class="clearfix">
          <li>
            <div class="bd_img">
              <a href="javascript:;">
                <img src="./uploads/pro.jpg" alt="" />
              </a>
            </div>
            <div class="imgDesc">
              <p>Apple苹果iPhone 6s Plus（A1699）32G 金色 移动联通电信4G手机</p>
              <p><span>￥6088</span><del>￥6988</del></p>
              <p class="clearfix">
                <span class="f14">已售87%</span>
                <span class="box"><em></em></span>
                <span class="f14">剩余<i class="style-red">29</i>件</span>
              </p>
            </div>
            <div class="goumai">
              <a href="javascript:;">立即购买</a>
            </div>
          </li>
          <li>
            <div class="bd_img">
              <a href="javascript:;">
                <img src="./uploads/pro.jpg" alt="" />
              </a>
            </div>
            <div class="imgDesc">
              <p>Apple苹果iPhone 6s Plus（A1699）32G 金色 移动联通电信4G手机</p>
              <p><span>￥6088</span><del>￥6988</del></p>
              <p class="clearfix">
                <span class="f14">已售87%</span>
                <span class="box"><em></em></span>
                <span class="f14">剩余<i class="style-red">29</i>件</span>
              </p>
            </div>
            <div class="goumai">
              <a href="javascript:;">立即购买</a>
            </div>
          </li>
          <li>
            <div class="bd_img">
              <a href="javascript:;">
                <img src="./uploads/pro.jpg" alt="" />
              </a>
            </div>
            <div class="imgDesc">
              <p>Apple苹果iPhone 6s Plus（A1699）32G 金色 移动联通电信4G手机</p>
              <p><span>￥6088</span><del>￥6988</del></p>
              <p class="clearfix">
                <span class="f14">已售87%</span>
                <span class="box"><em></em></span>
                <span class="f14">剩余<i class="style-red">29</i>件</span>
              </p>
            </div>
            <div class="goumai">
              <a href="javascript:;">立即购买</a>
            </div>
          </li>
          <li>
            <div class="bd_img">
              <a href="javascript:;">
                <img src="./uploads/pro.jpg" alt="" />
              </a>
            </div>
            <div class="imgDesc">
              <p>Apple苹果iPhone 6s Plus（A1699）32G 金色 移动联通电信4G手机</p>
              <p><span>￥6088</span><del>￥6988</del></p>
              <p class="clearfix">
                <span class="f14">已售87%</span>
                <span class="box"><em></em></span>
                <span class="f14">剩余<i class="style-red">29</i>件</span>
              </p>
            </div>
            <div class="goumai">
              <a href="javascript:;">立即购买</a>
            </div>
          </li>
          <li>
            <div class="bd_img">
              <a href="javascript:;">
                <img src="./uploads/pro.jpg" alt="" />
              </a>
            </div>
            <div class="imgDesc">
              <p>Apple苹果iPhone 6s Plus（A1699）32G 金色 移动联通电信4G手机</p>
              <p><span>￥6088</span><del>￥6988</del></p>
              <p class="clearfix">
                <span class="f14">已售87%</span>
                <span class="box"><em></em></span>
                <span class="f14">剩余<i class="style-red">29</i>件</span>
              </p>
            </div>
            <div class="goumai">
              <a href="javascript:;">立即购买</a>
            </div>
          </li>
          <li>
            <div class="bd_img">
              <a href="javascript:;">
                <img src="./uploads/pro.jpg" alt="" />
              </a>
            </div>
            <div class="imgDesc">
              <p>Apple苹果iPhone 6s Plus（A1699）32G 金色 移动联通电信4G手机</p>
              <p><span>￥6088</span><del>￥6988</del></p>
              <p class="clearfix">
                <span class="f14">已售87%</span>
                <span class="box"><em></em></span>
                <span class="f14">剩余<i class="style-red">29</i>件</span>
              </p>
            </div>
            <div class="goumai">
              <a href="javascript:;">立即购买</a>
            </div>
          </li>
          <li>
            <div class="bd_img">
              <a href="javascript:;">
                <img src="./uploads/pro.jpg" alt="" />
              </a>
            </div>
            <div class="imgDesc">
              <p>Apple苹果iPhone 6s Plus（A1699）32G 金色 移动联通电信4G手机</p>
              <p><span>￥6088</span><del>￥6988</del></p>
              <p class="clearfix">
                <span class="f14">已售87%</span>
                <span class="box"><em></em></span>
                <span class="f14">剩余<i class="style-red">29</i>件</span>
              </p>
            </div>
            <div class="goumai">
              <a href="javascript:;">立即购买</a>
            </div>
          </li>
          <li>
            <div class="bd_img">
              <a href="javascript:;">
                <img src="./uploads/pro.jpg" alt="" />
              </a>
            </div>
            <div class="imgDesc">
              <p>Apple苹果iPhone 6s Plus（A1699）32G 金色 移动联通电信4G手机</p>
              <p><span>￥6088</span><del>￥6988</del></p>
              <p class="clearfix">
                <span class="f14">已售87%</span>
                <span class="box"><em></em></span>
                <span class="f14">剩余<i class="style-red">29</i>件</span>
              </p>
            </div>
            <div class="goumai">
              <a href="javascript:;">立即购买</a>
            </div>
          </li>
        </ul>
      </div>
    </div>
    <!-- list结束 -->
    <!-- foter开始 -->
    <footer class="footer">
      <div class="w">
        <!-- 上 -->
        <div class="top">
          <ul>
            <li>
              <h5></h5>
              <h4>正品保障</h4>
              <p>正品保障，提供发票</p>
            </li>
            <li>
              <h5></h5>
              <h4>正品保障</h4>
              <p>正品保障，提供发票</p>
            </li>
            <li>
              <h5></h5>
              <h4>正品保障</h4>
              <p>正品保障，提供发票</p>
            </li>
            <li>
              <h5></h5>
              <h4>正品保障</h4>
              <p>正品保障，提供发票</p>
            </li>
            <li>
              <h5></h5>
              <h4>正品保障</h4>
              <p>正品保障，提供发票</p>
            </li>
          </ul>
        </div>
        <!-- 上结束 -->
        <!-- center开始 -->
        <div class="center">
          <div class="center_box">
            <h5>购物指南</h5>
            <ul>
              <li><a href="javasrcipt:;">购物流程</a></li>
              <li><a href="javasrcipt:;">会员介绍</a></li>
              <li><a href="javasrcipt:;">生活旅行/团购</a></li>
              <li><a href="javasrcipt:;">常见问题</a></li>
              <li><a href="javasrcipt:;">大家电</a></li>
              <li><a href="javasrcipt:;">联系客服</a></li>
            </ul>
          </div>
          <div class="center_box">
            <h5>购物指南</h5>
            <ul>
              <li><a href="javasrcipt:;">购物流程</a></li>
              <li><a href="javasrcipt:;">会员介绍</a></li>
              <li><a href="javasrcipt:;">生活旅行/团购</a></li>
              <li><a href="javasrcipt:;">常见问题</a></li>
              <li><a href="javasrcipt:;">大家电</a></li>
              <li><a href="javasrcipt:;">联系客服</a></li>
            </ul>
          </div>
          <div class="center_box">
            <h5>购物指南</h5>
            <ul>
              <li><a href="javasrcipt:;">购物流程</a></li>
              <li><a href="javasrcipt:;">会员介绍</a></li>
              <li><a href="javasrcipt:;">生活旅行/团购</a></li>
              <li><a href="javasrcipt:;">常见问题</a></li>
              <li><a href="javasrcipt:;">大家电</a></li>
              <li><a href="javasrcipt:;">联系客服</a></li>
            </ul>
          </div>
          <div class="center_box">
            <h5>购物指南</h5>
            <ul>
              <li><a href="javasrcipt:;">购物流程</a></li>
              <li><a href="javasrcipt:;">会员介绍</a></li>
              <li><a href="javasrcipt:;">生活旅行/团购</a></li>
              <li><a href="javasrcipt:;">常见问题</a></li>
              <li><a href="javasrcipt:;">大家电</a></li>
              <li><a href="javasrcipt:;">联系客服</a></li>
            </ul>
          </div>
          <div class="center_box">
            <h5>购物指南</h5>
            <ul>
              <li><a href="javasrcipt:;">购物流程</a></li>
              <li><a href="javasrcipt:;">会员介绍</a></li>
              <li><a href="javasrcipt:;">生活旅行/团购</a></li>
              <li><a href="javasrcipt:;">常见问题</a></li>
              <li><a href="javasrcipt:;">大家电</a></li>
              <li><a href="javasrcipt:;">联系客服</a></li>
            </ul>
          </div>
          <div class="center_box">
            <h5>帮助中心</h5>
            <img src="./images/wx_cz.jpg" alt="" />
            <p>品优购客户端</p>
          </div>
        </div>
        <!-- center开始 -->
        <!-- bottom开始 -->
        <div class="bottom">
          <div class="links">
            <a href="javascript:;">关于我们<span>|</span></a>
            <a href="javascript:;">联系我们<span>|</span></a>
            <a href="javascript:;">联系客服<span>|</span></a>
            <a href="javascript:;">商家入驻<span>|</span></a>
            <a href="javascript:;">营销中心<span>|</span></a>
            <a href="javascript:;">手机品优购<span>|</span></a>
            <a href="javascript:;">友情链接<span>|</span></a>
            <a href="javascript:;">销售联盟<span>|</span></a>
            <a href="javascript:;">品优购社区<span>|</span></a>
            <a href="javascript:;">品优购公益<span>|</span></a>
            <a href="javascript:;">English Site<span>|</span></a>
            <a href="javascript:;">Contact U</a>
          </div>
          <div class="copyright">
            地址：北京市昌平区建材城西路金燕龙办公楼一层 邮编：100096 电话：400-618-4000 传真：010-82935100 邮箱: zhanghj+itcast.cn <br />
            京ICP备08001421号京公网安备110108007702
          </div>
        </div>
        <!-- bottom结束 -->
      </div>
    </footer>
    <!-- foter结束 -->
  </body>
</html>
